<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="css/css/index.css">
    <link rel="stylesheet" href="css/css/bootstrap.min.css">
    <link rel="stylesheet" href="css/css/font-awesome.min.css">
    <script src="js/vue.min.js"></script>
    <title>检验报告</title>
</head>

<body>
    <div class="container">
        <div id="app">
            <a class="btn btn-success text-danger" @click="printContent()"><i class="fa fa-print"></i>打印</a>
            <a class="btn btn-success text-danger" href="index.html"><i class="fa fa-return"></i>返回</a>
            
            <div id="subOutputRank-print">
                <div v-for="(value, key) in storage">
                    <div class="text-center">
                        <h3 v-text="company"></h3>
                        <h4>水质检验报告</h4><br>
                    </div>
                    <div>
                        <h6>
                            <!-- <span class="text-left">样品编号：<span v-text="numbering"></span>(水)2018第
                            <span v-text="f_n(value[0].id,3)"></span>号
                            </span> -->
                        <span class="text-right" style="float: right">
                            第 3 页  共 3 页
                        </span>
                        </h6>
                    </div>
                    <table class="table table-bordered table-striped table-hover">
                        <tbody>
                            <tr>
                                <th class="text-center">样品编号</th>
                                <td contenteditable="true">
                                    <span v-text="numbering"></span>
                                    (水)2018第
                                    <span v-text="f_n(value[0].id, 5)"></span>
                                    号
                                </td>
                                <th class="text-center">样品名称</th>
                                <td>
                                    <select style="border: none">
                                        <option v-for="(item, index) in sample_name" :key="index">{{ item }}</option>
                                    </select>
                                </td>
                            </tr>
                            <tr>
                                <th class="text-center">受捡单位</th>
                                <td contenteditable="true"></td>
                                <th class="text-center">收样日期</th>
                                <td contenteditable="true" v-text="seive_date">
                                </td>
                            </tr>
                            <tr>
                                <th class="text-center">采样地点</th>
                                <td contenteditable="true"></td>
                                <th class="text-center">完成日期</th>
                                <td contenteditable="true" v-text="dateFormat(new Date())">
                                </td>
                            </tr>
                            <tr>
                                <th class="text-center">检测标准</th>
                                <td>GB/T 5750-2006</td>
                                <th class="text-center">卫生标准</th>
                                <td>GB 5749-2006</td>
                            </tr>
                        </tbody>
                    </table>
                    <table class="table table-bordered table-striped table-hover">
                        <thead>
                            <tr>
                                <th class="text-center">检验项目</th>
                                <th class="text-center">检测方法</th>
                                <th class="text-center">单位</th>
                                <th class="text-center">参考范围</th>
                                <th @click="ass=!ass" class="text-center">检验结果</th>
                                <th class="text-center" v-show="ass">单项评价</th>
                            </tr>
                        </thead>
                        <tbody class="text-center" v-for="(item, index) in value" :key="index">
                            <tr>
                                <td class="text-center" v-text="item.name"></td>
                                <td v-text="item.GB+item.method"></td>
                                <td v-text="item.unit"></td>
                                <td v-text="item.range"></td>
                                <td v-if="item.c<item.limit" v-text="'<'+item.limit"></td>
                                <td contenteditable="true" v-else v-text="item.c"></td>
                                <td contenteditable="true" v-show="ass" v-text="item.assessment"></td>
                            </tr>
                        </tbody>
                    </table>
                    <br><br>
                    <div class="row text-center">
                        <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4">检验者：</div>
                        <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4">审核者：</div>
                        <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4">日期：
                            <span v-text="dateFormat(new Date())"></span>
                        </div>
                    </div>
                    <div style="page-break-after:always"></div>
                </div>
            </div>
        </div>
    </div>
    </div>
    <br>
    <br>
    <br>
    <script src="sample.js"></script>
    <footer class="footer">
        <div>使用过程中有任何疑问或想法，欢迎在我的
            <a href="img/myWeiXin.jpg"><i class="fa fa-qq">水质检测系统QQ群</i></a>
            留言
        </div>
    </footer>
</body>
</html>
